import React, {Component} from 'react';
import './index.css';
import {InputNumber, Slider, Radio, Select, Upload, Icon, Checkbox} from 'antd';
import BaseOpts from '../BaseOpts';

const RadioGroup = Radio.Group;

class ConnectKfOpts extends BaseOpts {

    static defaultProps = {
        data: {
            style: {},
            dataset: {},
            layout: {}
        }
    };


    constructor(props) {
        super(props);

        this.state = {
            data: props.data
        };

    }

    render() {
        const {style, dataset, layout} = this.state.data;
        const pos = layout.pos || 'right';

        return (
            <div className="optsPanel">

                <div className="optsPanel__item">
                    <label className="optsPanel__item__hd">位置</label>
                    <div className="optsPanel__item__bd">
                        <RadioGroup
                            onChange={(evt) => {
                                this.$dataChange('pos', evt.target.value, 'layout');
                            }}
                            value={pos}
                        >
                            <Radio value={'left'}>左</Radio>
                            <Radio value={'right'}>右</Radio>
                        </RadioGroup>
                    </div>
                </div>

            </div>
        );
    }
}

export default ConnectKfOpts;